<template>
  <div>
    <el-input
      v-model="filterText"
      placeholder="输入关键字进行过滤"
    ></el-input>
    <el-tree
      :data="data"
      :props="defaultProps"
      node-key="catId"
      :default-expanded-keys="expandedKeys"
      :expand-on-click-node="false"
      @node-click="handleNodeClick"
    >
    </el-tree>
  </div>
</template>

<script>
export default {
  data () {
    return {
      filterText: '',
      data: [],
      expandedKeys: [],
      defaultProps: {
        children: 'childCategory',
        label: 'name'
      }
    }
  },
  methods: {
    getCategoryListTree () {
      this.dataListLoading = true
      this.$http({
        url: this.$http.adornUrl('/product/category/list/tree'),
        methd: 'get'
      }).then(({data}) => {
        this.data = data.data
        this.dataListLoading = false
      })
    },
    handleNodeClick (data, Node, componet) {
      this.$emit('node-click', data, Node, componet)
    }
  },
  created () {
    this.getCategoryListTree()
  }
}
</script>

<style>
</style>